<style>
.layui-form-pane .layui-form-label{width:auto;}
.layui-form-item{margin-bottom: 0px;}
.role_style{background-color:#00CCCC;}
.copy-url-style{color: #00a0e9}
</style>
<div class="fixed-bar">
    <form class="layui-form layui-form-pane fixed-bar-form" action="{:url()}" method="get" id="hisi-table-search">
        <div class="layui-form-item">

         <div class="layui-inline">
            <label class="layui-form-label">关键字</label>
             <div class="layui-input-inline">
                 <input type="text" name="name" lay-verify="" placeholder="标签名称关键字" class="layui-input">
             </div>
         </div>
         <div class="layui-inline">
            <button type="submit" class="layui-btn" lay-submit="" lay-filter="demo1">搜索</button>
         </div>
        </div>
    </form>
</div>

<table id="dataTable"  lay-filter="demoEvent"></table>
{include file="system@block/layui" /}

<script type="text/html" id="toolbar">
    <div class="layui-btn-group fl">
        <a href="{:url('boardList')}?use_action=edit_search_label" class="layui-btn layui-btn-primary
		layui-btn-sm layui-icon layui-icon-add-circle-fine hisi-iframe" hisi-data="{width: '1200px', height: '660px'}" title="新增配置看板（物料与生产结合配置）">&nbsp;新增配置看板</a>
    </div>
</script>
<script type="text/html" title="操作按钮模板" id="buttonTpl">
	<a href="{:url('boardList')}?use_action=edit_search_label&id={{ d.id }}" class="layui-btn layui-btn-xs layui-btn-normal hisi-iframe" hisi-data="{width: '800px', height: '660px'}" title="修改">修改</a>
	<a href="{:url('boardList')}?use_action=del_search_label&id={{ d.id }}&val=-1"  hisi-data="{refresh: true}" class="layui-btn layui-btn-xs layui-btn-danger j-tr-del">删除</a>
</script>
<script type="text/html" id="useOrders">
    {{ d.use_orders_30d }} /
	{{# if(d.use_orders > 0){ }}
		<a href="{:url('history')}?id={{ d.id }}" class="hisi-iframe blue" title="使用产品记录">{{ d.use_orders }}</a>
	{{# }else{ }}
		0
	{{# } }}
</script>
<script type="text/html" title="" id="showDataTpl">
	<input type="checkbox" name="status[{{ d.id }}]" lay-filter="showStatus" value="{{ d.id }}" lay-skin="switch" lay-text="开|关" {{# if(d.show_status > 0){ }}checked=""{{#  } }}>
</script>
<script type="text/html" id="useTimeTpl">
    <div>{{layui.util.toDateString(d.use_time * 1000) }}</div>
</script>
<script type="text/html" id="search_time">
    {{# if(d.search_history !='' ){ }}
    <span class="copy-item"> {{ d.search_end_time}} / {{d.search_history}} </span>
    {{# }else{ }}
    <span class="copy-item">{{ d.search_start_time}} ~ {{d.search_end_time}} </span>
    {{#  } }}
</script>
<script type="text/html" id="copy_url">
    <span class="copy-url-style" lay-event="copy_look_url" data-url="{{ document.domain }}/index.php/mp/board/index?address_id={{d.address_id}}">复制</span>
</script>
<script type="text/html" id="copy_video_url">
    <span class="copy-url-style" lay-event="copy_look_url" data-url="{{ document.domain }}/index.php/mp/board/showVideo?address_id={{d.address_id}}">复制</span>
</script>

<script type="text/javascript">
    layui.use(['table', 'tool','opTable','form','jquery'], function() {
        var table = layui.table,form = layui.form;
		var $ = layui.jquery;

        // var opTable = layui.opTable.render({
        table.render({
            elem: '#dataTable'
            ,url: '{:url()}' //数据接口
            ,page: true //开启分页
            ,skin: 'row'
            ,even: true
            ,limit: 20
            ,limits: [20,50,100,150,200]
            ,text: {
                none : '暂无相关数据'
            }
            ,toolbar: '#toolbar'
            ,defaultToolbar: ['filter', 'exports', 'print']
            ,cols: [[ //表头
                {type:'checkbox',field:'checkbox'}
                ,{field: 'address_name', title: '展示地点',width: 180}
                ,{field: 'label_name', title: '配置项名称',width: 120}
                ,{field: 'order', title: '排序',edit:'text',width:50,style:'color:#3399FF;border-bottom:1px dashed #5FB878;'}
                ,{field: 'search_end_time', title: '搜索时间范围',width: 130, templet:'#search_time'}
                ,{field: 'copy_url', templet:'#copy_url', title:'查看网址'}
                ,{field: 'copy_video_url', templet:'#copy_video_url', title:'查看视频'}
				,{field: 'marerialStatus_str', title: '搜索物料状态'}
				,{field: 'order_status', title: '订单状态'}
				,{field: 'm_status_logic', title: '状态关系',width: 90,templet:function(d){return d.m_status_logic=='and'?'并且':'或者';}}
				,{field: 'materialtype_str', title: '显示物料',width: 80}
				,{field: 'order_type', title: '单类',width: 80}
				,{field: 'shipment_day', title: '交货时间范围(货期-当前日期)',width: 120}
                ,{field: 'factory_ids_str', title: '搜索工厂',width: 160}
                ,{field: 'factory_ids_str', title: '分组',width: 60}
				,{field: 'visit_role_ids', title: '可浏览角色及成员',width: 130,templet:function(d){return '<span class="role_style">'+d.visit_roles_str+'</span> '+d.visit_admins_str;}}
				,{field: 'admin_user', title: '最后编辑',width: 70}
                ,{field: 'create_time', title: '更新时间',width: 100,templet:function(d){ if(d.create_time>0){
					return"<span title="+layui.util.toDateString(d.update_time * 1000,'yyyy-MM-dd HH:mm')+">"+layui.util.toDateString(d.update_time * 1000,'MM-dd HH:mm')+"</span>";
				}else{
					return '--';
				}}}
                ,{field: 'show_status', title: '状态',width: 65,templet:'#showDataTpl'}
              ,{field: '', title: '操作', templet: '#buttonTpl', fixed: 'right',width: 100}
            ]]
            //  展开的列配置
            ,done: function(res, curr, count){
               // merge(res);
                //修改排序
                table.on('edit(demoEvent)', function(obj){
                    var value = obj.value //得到修改后的值
                        ,d = obj.data //得到所在行所有键值
                        ,field = obj.field; //得到字段
                    var id=d.id;
                    // 编辑排序
                    if (field == 'order') {
                        $.ajax({
                            type: "POST",
                            url: "{:url('setBorad')}",
                            data: "id="+d.id+"&order="+value,
                            dataType:"json",
                            success: function(res){
                                layer.msg('已修改', {icon: 1});
                            }
                        });
                    }

                });
                //拷贝查看地址
                table.on('tool(demoEvent)', function(obj){
                    if(obj.event === 'copy_look_url') {
                        var data_url=$(this).attr("data-url")
                        layui.tool.copyText(data_url);
                    }
                });

            }
        });
  /*      function merge(res) {
            var data = res.data;
            var mergeIndex = 0;//定位需要添加合并属性的行数
            var mark = 1; //这里涉及到简单的运算，mark是计算每次需要合并的格子数
            var columsName = ['address_name'];//需要合并的列名称
            var columsIndex = [1];//需要合并的列索引值

            for (var k = 0; k < columsName.length; k++) { //这里循环所有要合并的列
                var trArr = $(".layui-table-body>.layui-table").find("tr");//所有行

                for (var i = 1; i < res.data.length; i++) { //这里循环表格当前的数据
                    var tdCurArr = trArr.eq(i).find("td").eq(columsIndex[k]);//获取当前行的当前列
                    var tdPreArr = trArr.eq(mergeIndex).find("td").eq(columsIndex[k]);//获取相同列的第一列
                    if (data[i][columsName[k]] === data[i - 1][columsName[k]]) { //后一行的值与前一行的值做比较，相同就需要合并
                        mark += 1;
                        //相同列的第一列增加rowspan属性
                        tdPreArr.each(function () {
                            $(this).attr("rowspan", mark);
                        });
                        //当前行隐藏
                        tdCurArr.each(function () {
                            $(this).css("visibility", "hidden");
                        });
                    } else {
                        mergeIndex = i;
                        mark = 1;//一旦前后两行的值不一样了，那么需要合并的格子数mark就需要重新计算                    }
                    }
                    mergeIndex = 0;
                    mark = 1;
                }
            }
        }*/
		form.on('switch(showStatus)', function(data){
		  console.log(data.elem.checked); //开关是否开启，true或者false
		  	var label_id=data.value;
		  	var show_status=data.elem.checked==true ? 1 : 0;
			console.log(data.value);
			$.ajax({
			   type: "POST",
			   url: "{:url('addSearchLabel')}",
			   data: "show_status="+show_status+"&id="+label_id,
			   dataType:"json",
			   success: function(res){
				  if (res.code == 1) {
					 layer.msg(res.msg, {icon: 1});
				  } else {
					 layer.msg(res.msg, {icon: 2,anim: 6});
				  }
			   }
			});
		});
    });
</script>